{{ $ := .root }}
{{ $page := .page }}

{{ $alignment := ($page.Params.alignment | default "center") }}

<div class="page-header row">
  {{ if eq $alignment "center" }}
    <div class="col-12 alignment-center">
      <div class="row justify-content-center">
        {{ with $page.Params.logo }}
        <div class="section-heading col-6 justify-content-center">
          <img src="{{ . | safeHTMLAttr | relURL }}" {{ if $page.Params.logo_height }}height="{{ $page.Params.logo_height | safeHTMLAttr }}"{{ end }} {{ if $page.Params.logo_title }}title="{{ $page.Params.logo_title | safeHTMLAttr }}"{{ end }}>
        </div>
        <div class="w-100"></div>
        {{ end }}
        {{ if or $page.Title $page.Params.subtitle }}
        <div class="section-heading col-12 col-md-5 mb-4 text-center">
          {{ with $page.Title }}
          <h1>{{ . | markdownify | emojify }}</h1>
          {{ end }}
          {{ if $page.Params.subtitle }}<p>{{ $page.Params.subtitle | markdownify | emojify }}</p>{{ end }}
        </div>
        {{ end }}

        {{ with $page.Content }}
        <div class="content col-12">
          {{ . }}
        </div>
        {{ end }}

        {{ with $page.Params.button }}
        <div class="buttons col-12 mb-4">
          <div class="row justify-content-center">
            {{ range $page.Params.button }}
              {{ if and .title .url }}
                <div class="button mb-2">
                  <a class="mosaic-btn mosaic-btn-light" href="{{ .url | safeHTMLAttr | relURL }}" title="{{ .title | safeHTMLAttr }}">
                    {{ if .icon }}<i class='fa fa-{{ .icon }}' aria-hidden='true'></i> {{ end }}
                    {{ .title | safeHTML }}
                    {{ if .subtitle }}
                      <span class="subtitle">{{ .subtitle | safeHTML }}</span>
                    {{ end }}
                  </a>
                </div>
              {{ end }}
            {{ end }}
          </div>
        </div>
        {{ end }}
      </div>
    </div>
  {{ else }}
    <div class="alignment-left col-md-12">
      <div class="row">
        <div class="col-12 col-md-9">
          {{ with $page.Params.logo }}
          <div class="row">
            <div class="page-header-logo col-md-12">
              <img src="{{ . | safeHTMLAttr | relURL }}" {{ if $page.Params.logo_height }}style="height:{{ $page.Params.logo_height | safeHTMLAttr }};"{{ end }} {{ if $page.Params.logo_title }}title="{{ $page.Params.logo_title | safeHTMLAttr }}"{{ end }}>
            </div>
          </div>
          {{ end }}
          {{ if or $page.Title $page.Params.subtitle }}
          <div class="row">
            <div class="col-12">
              <div class="section-heading text-left">
                {{ with $page.Title }}
                <h1>{{ . | markdownify | emojify }}</h1>
                {{ end }}
                {{ if $page.Params.subtitle }}<p>{{ $page.Params.subtitle | markdownify | emojify }}</p>{{ end }}
              </div>
            </div>
          </div>
          {{ end }}
        </div>
        {{ with $page.Params.button }}
          <div class="buttons col-md-3 d-none d-md-block justify-content-right">
            {{ range $page.Params.button }}
              <div class="col-md-12">
                {{ if .title }}{{ if .url }}
                  {{- $version_set := .include_latest_release -}}
                  {{- $version := "UNDEFINED" -}}
                  {{ if .include_latest_release }}
                    {{- range $key, $value := $.Site.Data.mosaic.versions -}}
                      {{- if eq $key "mosaic" -}}
                        {{- $version = $value -}}
                      {{- end -}}
                    {{- end -}}
                    {{- if eq $version "UNDEFINED" -}}
                      {{- $version_set = false -}}
                    {{- end -}}
                  {{- end -}}
                  <a class="mosaic-btn mosaic-btn-light {{ if or ($version_set) (.subtitle) }}mosaic-btn-subtitle{{ end }} float-end" href="{{ .url | safeHTMLAttr | relURL }}" title="{{ .title | safeHTMLAttr }}">
                    {{ if .include_latest_release }}
                      <span class="icon"><i class='{{ .icon | safeHTML }}' aria-hidden='true'></i></span>
                      <span class="title-wrap">
                        <span class="title">
                          {{ .title | safeHTML }}
                          {{ if $version_set }}
                          <span class="subtitle">Latest Release: {{ $version | safeHTML }}</span>
                          {{ end }}
                        </span>
                      </span>
                    {{ else }}
                    <span class="icon"><i class='{{ .icon | safeHTML }}' aria-hidden='true'></i></span>
                    <span class="title-wrap">
                      <span class="title">
                        {{ .title | safeHTML }}
                        {{ if .subtitle }}
                          <span class="subtitle">{{ .subtitle | safeHTML }}</span>
                        {{ end }}
                      </span>
                    </span>
                    {{ end }}
                  </a>
                {{ end }}{{ end }}
              </div>
            {{ end }}
          </div>
        {{ end }}
      </div>
    </div>
  {{ end }}

  {{ with $page.Params.feature }}
  <div class="features col-md-12 align-items-end">
    <div class="row justify-content-center">
      {{ $feature_col_width := $page.Params.feature_col_width | default "4" }}
      {{ range $page.Params.feature }}
        {{ $pack := or .icon_pack "fas" }}
        {{ $pack_prefix := $pack }}
        {{ if in (slice "fab" "fas" "far" "fal") $pack }}
          {{ $pack_prefix = "fa" }}
        {{ end }}
        <div class="feature col-12 col-md-{{ $feature_col_width }} mb-3 mb-md-0">
          <div class="feature-inner {{ if and .link_title .link_url .link_feature }}is-linked-feature{{end}}">
            {{ if and .link_title .link_url .link_feature }}
            <a href="{{ .link_url | safeHTMLAttr | relURL }}" title="{{ .link_title | safeHTMLAttr }}" class="linked-feature">
            {{ end}}
              {{ with .icon }}
              <div class="page-header-icon">
                {{- if eq $pack "emoji" -}}
                  {{- . | emojify -}}
                {{- else if eq $pack "custom" -}}
                  {{- $svg_icon := resources.Get (printf "images/icon-pack/%s.svg" .) -}}
                  {{- if $svg_icon -}}<img src="{{ $svg_icon.RelPermalink }}" alt="{{.}}" class="svg-icon svg-baseline">{{- end -}}
                {{- else -}}
                  <i class="{{ $pack }} {{ $pack_prefix }}-{{ . }}"></i>
                {{- end -}}
              </div>
              {{ end }}
              <h3>{{ .name | markdownify | emojify }}</h3>
              {{ with .description }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
              {{ if and .link_title .link_url }}
                {{ if .link_feature }}
                  <p class="feature-link">{{ .link_title }}</p>
                {{ else }}
                  <a class="feature-link" href="{{ .link_url | safeHTMLAttr | relURL }}" title="{{ .link_title | safeHTMLAttr }}">{{ .link_title }}</a>
                {{ end }}
              {{ end }}
            {{ if and .link_title .link_url .link_feature }}
            </a>
            {{ end}}
          </div>
        </div>
      {{ end }}
    </div>
  </div>
  {{ end }}

</div>

{{ if not (and $page.Params.button $page.Params.feature) }}
  <hr class="vertical-span" />
{{end}}
